<template>
    <div class="my-task">
        <slot></slot>
        <ul class="list">
            <li v-for="item,index in list" :key="item.id">
                <input type="checkbox" v-model="item.status" @change="changeStatus({index,ck:item.status})">
                <p>{{item.title}}</p>
                <button @click="dels(item.id)">删除</button>
            </li>
        </ul>
    </div>
</template>
<script>
import {mapMutations,} from 'vuex'
export default {
    props:['list'],
    data() {
        return {
            
        }
    },
    methods: {
        dels(id){
            this.delOk(id)

        },
        ...mapMutations(['delOk','changeStatus']),

        // checks(index,ck){
        //     // this.$store.commit('changeStatus',{index,ck})
        //     this.changeStatus({index,ck})
        // }
    },
}
</script>
<style lang="scss" scoped>
.my-task{
    width: 1200px;
    margin: 0 auto;
    .list{
        li{
            display: flex;
            p{
                flex:1;
            }
        }
    }


}
</style>
